<%-- 
    Document   : GenerarRelacionGrado
    Created on : 18/12/2013, 08:14:18 PM
    Author     : CHRISTIAN
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="css/style1.css">
        <link rel="stylesheet" type="text/css" href="css/style.css">
        <script type="text/javascript" src="js/JSGenerarRelacionGrado.js"></script>
        <script type="text/javascript" src="js/ajax.googleapis.com_ajax_libs_jquery_1.10.2_jquery.min.js"></script>
        <script type="text/javascript" src="js/code.jquery.com_jquery-1.9.1.min.js"></script>
        <script type="text/javascript" src="js/jquery.bassistance.de_validate_additional-methods.js"></script>
        <script type="text/javascript" src="js/jquery.bassistance.de_validate_jquery.validate.js"></script>


        <!-- Jqgrid-->
        <link rel="stylesheet" href="jqgrid/css/style.css"/>
        <link rel="stylesheet" href="jqgrid/css/redmond/jquery-ui.css"/>
        <link rel="stylesheet" href="jqgrid/css/redmond/jquery.ui.theme.css"/>
        <link rel="stylesheet" href="jqgrid/css/jqgrid/ui.jqgrid.css"/>

        <script src="jqgrid/js/grid.locale-en.js" type="text/javascript"></script>
        <script src="jqgrid/js/jquery.jqGrid.min.js" type="text/javascript"></script>
        <script src="jqgrid/js/jquery-ui.min.js"></script>
        
        <meta charset=utf-8 />
        <title>Relacion de Grado</title>
    </head>
    <body>

        <div class="contenido">
            <center>
                <div class="contenidoInfo">
                    <div class="contenido">
                        <div class="tabs">
                            <a data-toggle="tab1">Grado Academico</a>
                            <a data-toggle="tab2">Título Profesional</a>
                            <a data-toggle="tab3">Grado Maestro</a>
                        </div>
                        <div class="tabContent">  
                            <div id="tab1" >
                                <input type="button" onclick="listarGradoBachiller()"/>
                                <div>                
                                    <table id="listGrid"></table> 
                                    <div id="pagerGrid"></div>
                                </div> 
                            </div>
                            <div id="tab2">
                                <br/>
                                <center>
                                    <table border="black" cellspacing="0px" >
                                        <thead>
                                            <tr style="background-color: #797979;color: white">
                                                <td>Nro</td>
                                                <td>Apellidos y Nombres</td>
                                                <td>Denominacion Diploma</td>
                                                <td>Fecha Aprobacion C.Fac.</td>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td>1</td>
                                                <td>Calderon Sarmiento, Davis</td>
                                                <td>Grado Academico</td>
                                                <td>12/12/13</td>
                                            </tr>
                                            <tr>
                                                <td>1</td>
                                                <td>Calderon Sarmiento, Davis</td>
                                                <td>Grado Academico</td>
                                                <td>12/12/13</td>
                                            </tr>
                                            <tr>
                                                <td>1</td>
                                                <td>Calderon Sarmiento, Davis</td>
                                                <td>Grado Academico</td>
                                                <td>12/12/13</td>
                                            </tr>
                                            <tr>
                                                <td>1</td>
                                                <td>Calderon Sarmiento, Davis</td>
                                                <td>Grado Academico</td>
                                                <td>12/12/13</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </center>
                            </div>

                            <div id="tab3">
                                <br/>
                                <center>
                                    <table border="black" cellspacing="0px" >
                                        <thead>
                                            <tr style="background-color: #797979;color: white">
                                                <td>Nro</td>
                                                <td>Apellidos y Nombres</td>
                                                <td>Denominacion Diploma</td>
                                                <td>Fecha Aprobacion C.Fac.</td>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td>1</td>
                                                <td>Calderon Sarmiento, Davis</td>
                                                <td>Grado Academico</td>
                                                <td>12/12/13</td>
                                            </tr>
                                            <tr>
                                                <td>1</td>
                                                <td>Calderon Sarmiento, Davis</td>
                                                <td>Grado Academico</td>
                                                <td>12/12/13</td>
                                            </tr>
                                            <tr>
                                                <td>1</td>
                                                <td>Calderon Sarmiento, Davis</td>
                                                <td>Grado Academico</td>
                                                <td>12/12/13</td>
                                            </tr>
                                            <tr>
                                                <td>1</td>
                                                <td>Calderon Sarmiento, Davis</td>
                                                <td>Grado Academico</td>
                                                <td>12/12/13</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </center>
                            </div>

                        </div>
                        <div style="text-align: right">
                            <input type="button" value="Generar"/><input type="button" value="Cancelar"/>
                        </div>
                    </div>

                </div>

            </center>
        </div>


        <!--<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>-->
        <script type="text/javascript" src="js/jquery.min.js"></script>
        <script src="html5jtabs.js"></script>
        <script>
                                $(function() {

                                    ;
                                    (function($) {
                                        $.fn.html5jTabs = function(options) {
                                            return this.each(function(index, value) {
                                                var obj = $(this),
                                                        objFirst = obj.eq(index),
                                                        objNotFirst = obj.not(objFirst);

                                                $("#" + objNotFirst.attr("data-toggle")).hide();
                                                $(this).eq(index).addClass("active");

                                                obj.click(function(evt) {

                                                    toggler = "#" + obj.attr("data-toggle");
                                                    togglerRest = $(toggler).parent().find("div");

                                                    togglerRest.hide().removeClass("active");
                                                    $(toggler).show().addClass("active");

                                                    $(this).parent("div").find("a").removeClass("active");
                                                    $(this).addClass("active");
                                                    return false;
                                                });
                                            });
                                        };
                                    }(jQuery));

                                    $(function() {
                                        $(".tabs a").html5jTabs();
                                    });
                                });
        </script>
    </body>
</html>
